import React, { useEffect, useState } from "react";
import instance from "../../api/request";
import styles from "./Index.module.css";
import dayjs from "dayjs";
import { Avatar } from "antd-mobile";
function Index() {
  const [page, setPage] = useState(1);
  const [count, setCount] = useState(5);
  const [data, setData] = useState([]);

  useEffect(() => {
    instance
      .get("/user/sickCircle/verify/v1/findMySickCircleList", {
        params: {
          page: page,
          count: count,
        },
      })
      .then((res) => {
        console.log(res);
        setData(res.data.result);
      });
  },[page, count]);

  return (
    <div className={styles.userz}>


      <div className={styles.shang}>

        <img src="./userbng.png" alt="" />
         <div className={styles.wen}>
          <Avatar  src="" style={{ "--border-radius": "50%" }} />
        </div>
      </div>



      <div className={styles.wenz}>
        <div>
          <img src="./wen.jpg" alt="" />
        </div>
        <div className={styles.zi}>他发布的病友圈</div>
      </div>

      <div className={styles.list}>
        {data.map((item, index) => {
          return <div key={index} className={styles.listn}>
            <div>
              <h1 style={{marginTop:'10px'}}>{item.title}</h1>
            </div>
            <div>
            <p style={{marginTop:'10px'}}>{dayjs(item.releaseTime).format('YYYY-MM-DD HH:mm:ss')}</p>
            </div>

          <div>
            <p style={{marginTop:'10px'}}>{item.detail}</p>
          </div>

          <div style={{marginTop:'10px'}}>
            <span style={{marginLeft:'270px'}}>收藏{item.collectionNum}</span><span style={{marginLeft:'10px'}}>建议:{item.commentNum}</span>
          </div>

          </div>
        })}
      </div>
    </div>
  );
}

export default Index;
